class Slider {
    constructor(id) {
        this.container = document.getElementById(id);
        this.items = this.container.querySelectorAll('.slider_list_item,.slider_list_item_selected');
    }
    getSelectedItem() {
        const selected = this.container.querySelector('.slider_list_item_selected');
        return selected;
    }
    getSelectedItemIndex() {
        return Array.from(this.items).indexOf(this.getSelectedItem());
    }
    slideTo(idx) {
        const selected = this.getSelectedItem();
        if(selected) {
            selected.className = 'slider_list_item';
        }
        const item = this.items[idx];
        if(item) {
            item.className = 'slider_list_item_selected';
        }
    }
    slideNext() {
        const currentIdx = this.getSelectedItemIndex();
        const nextIdx = (currentIdx + 1) % this.items.length;
        slideTo(nextIdx);
    }
    slidePrevious() {
        const currentIdx = this.getSelectedItemIndex();
        const preIdx = (currentIdx + 1) % this.items.length;
        slideTo(preIdx);
    }
}

const slider = new Slider('my-slider');
setInterval(() => {
    slider.slideNext();
}, 3000);
